<!--
@Description:商品2.0-定制和橱柜系列项组件
@Author:zqy
@Date:2021-11-27 10:56:10
@Last Modified by:zqy
@Last Modified time:2021-11-27 10:56:10
-->
<template>
  <div class="newpro-window" @click.stop="clickHandle">
    <div class="show-window-img">
      <ImageVideo :host="host" :src="src" fit="fill" />
    </div>
  </div>
</template>
<script>
import errorSrc from '@/assets/error.png'
import ImageVideo from '@/components/ImageVideo'
export default {
  name: 'ShowWindow',
  components: {
    ImageVideo
  },
  props: {
    src: {
      type: String,
      default: ''
    },
    name: {
      type: String,
      default: ''
    },
    show: {
      type: Boolean,
      default: true
    },
    host: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      errorSrc
    }
  },
  computed: {

  },
  methods: {
    clickHandle() {
      this.$emit('click')
    }
  }
}
</script>
<style lang="less" scoped>
  .newpro-window{
    width: 100%;
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    background-color: #fff;
    margin-left: 0 !important;
    margin-bottom: 15px !important;
    --width: calc(100vw - 24px);
    .show-window-img{
      height: calc(var(--width) * 150 / 345);
      background-color: #fff;
    }
    // 失败图片定位样式
    .van-image__error, .van-image__loading{
      position: relative;
    }
  }
  .search-container {
    .newpro-window{
      width: 100%;
    }
  }
</style>
